$(function () {
    let forms = layui.form
    forms.verify({
        url: [
            /^((ht|f)tps?):\/\/[\w\-]+(\.[\w\-]+)+([\w\-.,@?^=%&:\/~+#]*[\w\-@?^=%&\/~+#])?$/,
            '请输入正确的url地址'
        ]
    })
    // 公用请求配置
    $.ajaxPrefilter((options) => {
        options.url = 'http://localhost:8888/' + options.url
        options.headers = {
            "Authorization": localStorage.getItem('token')
        }
    })
    renderLink()
    //渲染友情列表
    function renderLink() {
        $.ajax({
            url: 'admin/links',
            success: function (res) {
                let html = template('tpl-link', res)
                $('tbody').html(html)
            }
        })
    }
    let addIndex;
    // 显示友情链接面板
    $('.add_link').on('click', function () {
        addIndex = layer.open({
            type: 1,
            title: '添加友情链接',
            area: ['550px', '400px'],
            content: $('#tpl-add').html() //这里content是一个普通的String
        })
    })
    // 上传图片
    $('body').on('click', '.up_img', function () {
        $('#uploads_img').click()
    })
    // 添加友情链接数据
    $('body').on('submit', '#add_form', function (e) {
        e.preventDefault();
        let data = new FormData(this)
        // 发送请求
        $.ajax({
            type: 'post',
            data: data,
            url: 'admin/links',
            success: function (res) {
                layer.msg(res.message)
                if (res.status === 0) { // 成功重新渲染 数据
                    renderLink()
                    layer.close(addIndex)
                }
            },
            processData: false,
            contentType: false
        })
    })

    // 删除链接
    $('body').on('click', '.del_link', function () {
        let id = $(this).data('id')
        console.log(id);
        layer.confirm('确认要删除链接?', function (index) {
            // 发送删除请求
            $.ajax({
                type: 'delete',
                url: `admin/links/${id}`,
                success: function (res) {
                    layer.msg(res.message)
                    if (res.status === 0) {
                        renderLink()
                    }
                }
            })

            layer.close(index);
        });
    })

    let editId;
    let editIndex;
    // 展示编辑面板
    $('body').on('click', '.edit_link', function () {
        editIndex =  layer.open({
            type: 1,
            title: '编辑友情链接',
            area: ['550px', '400px'],
            content: $('#tpl-edit').html() //这里content是一个普通的String
        })
        let data = $(this).data()
        forms.val("edit", data);
        editId = data.id
    })

    // 编辑数据
    $('body').on('submit', '#up_form', function (e){ 
        e.preventDefault()
        let data = new FormData(this)
        $.ajax({
            type: 'put',
            data: data,
            url:`admin/links/${editId}`,
            success: function(res) {
                layer.msg(res.message)
                if(res.status === 0) {
                    renderLink()
                    layer.close(editIndex)
                }
            },
            contentType: false,
            processData: false
        })
    })
})